<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<html>
			<head>
				<meta charset="utf-8">
				<title></title>
		
				<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
			</head>
			<body>
				<div id="app">
					<input type="text" v-model="num1" />
					+
					<input type="text" v-model="num2" />
					<button v-on:click="add">=</button>
					<input type="text" v-model="result" />
				</div>
				
				<script>
					// 第三步: 创建一个Vue的实例对象
					var app = Vue.createApp({
						data() {
							return {
								num1:'',
								num2:'',
								result:''
							}
						},
						methods:{
							add:function()
							{
								console.log("执行加法")
								var x = parseInt(this.num1)
								var y = parseInt(this.num2)
								var z = x+y;
								this.result = z;
							}
						}
					});
					// 第四步: 把app挂载到视图上
					var vm = app.mount("#app")
				</script>
		
		
		
			</body>
		</html>
	</body>
</html>